import 'dart:ffi';

import 'package:flutter/cupertino.dart';
import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
import 'package:jetour_line/base_widget/base_image.dart';
import 'package:jetour_line/base_widget/image_network_widget.dart';
import 'package:jetour_line/base_widget/sliver_list_widget.dart';
import 'package:jetour_line/my_colors.dart';
import 'package:jetour_line/pages/baseWidget/title_widget.dart';
import 'package:jetour_line/pages/line/lineDetail/line_detail_page.dart';
import 'package:jetour_line/utils/extension_int.dart';
import 'package:jetour_line/utils/print_utils.dart';
import "package:jetour_line/models/guide_list_model.dart" as user_guide;

import '../../utils/page_push_utils.dart';
import '../common/commonDetail/common_detail_page.dart';
import '../common/common_list_page.dart';
import '../line/line_list_page.dart';
import "package:jetour_line/models/line_list_model.dart" as line_list;

import '../webview/webview_page.dart';

typedef _ChangeTypeCallBack = void Function(int type);
class HomeCommonWidget extends StatefulWidget {
  final  List<line_list.ListElement> lineList ;
  final _ChangeTypeCallBack callBack;
  int? cityId ;
  String? cityName;
  HomeCommonWidget({Key? key, required this.lineList,this.cityName,this.cityId, required this.callBack}) : super(key: key);

  @override
  State<HomeCommonWidget> createState() => _HomeCommonWidgetState();
}

class _HomeCommonWidgetState extends State<HomeCommonWidget> {
  int type  = 1;
  @override
  Widget build(BuildContext context) {
    return widget.lineList.isEmpty
        ? SizedBox()
        : SliverListWidget.getSliverList(1, (context, index) {
            return Column(
              children: [
                GestureDetector(
                  onTap: () {
                    // PagePushUtils.push(context, WebviewScreen(url: 'model.url'));
                    PagePushUtils.push(context,  LineListPage(cityId: widget.cityId,cityName: widget.cityName,));
                  },
                  child: Container(
                    color: Colors.transparent,
                    child: Row(
                      children: [
                        SizedBox(
                          width: 20.px,
                          height: 80.px,
                        ),
                        Expanded(
                            child: Text(
                          "精选路书",
                          style: TextStyle(
                              fontSize: 32.px,
                              color: MyColors.color1A1A1A,
                              fontWeight: FontWeight.w500),
                        )),
                        Text(
                          "更多",
                          style: TextStyle(
                              fontSize: 26.px, color: MyColors.color999999),
                        ),
                        BaseImage(image: 'btn_jump', width: 32.px,height: 32.px,),
                        SizedBox(
                          width: 20.px,
                        ),
                      ],
                    ),
                  ),
                ),
                SizedBox(
                  height: 16.px,
                ),
                Container(
                  margin: EdgeInsets.only(bottom: 32.px),
                  height: 360.px,
                  child: ListView.builder(
                    itemBuilder: (context, index) {
                      return getItemWidget(index);
                    },
                    itemCount: widget.lineList.length,
                    scrollDirection: Axis.horizontal,
                  ),
                ),
                GestureDetector(
                  onTap: () {
                    PagePushUtils.push(context,  CommonListPage(type: type,cityId: widget.cityId,cityName: widget.cityName,));
                  },
                  child: Container(
                    color: Colors.transparent,
                    child: Row(
                      children: [
                        SizedBox(
                          width: 20.px,
                          height: 80.px,
                        ),
                        SizedBox(
                          width: 440.px,
                          height: 80.px,
                          child: TitleWidget( const ['精选共创路书','最新路书'],color: Colors.transparent, selectIndexCallBack: (index){
                              if(index == 0){
                                type = 1;
                                widget.callBack(1);
                              }else{
                                type = 0;
                                widget.callBack(0);
                              }
                          }),
                        ),


                        const Expanded(child: SizedBox()),
                        Text(
                          "更多",
                          style: TextStyle(
                              fontSize: 26.px, color: MyColors.color999999),
                        ),
                        BaseImage(image:'btn_jump',width: 32.px, height: 32.px,),
                        SizedBox(
                          width: 20.px,
                        ),
                      ],
                    ),
                  ),
                ),
                SizedBox(
                  height: 16.px,
                )
              ],
            );
          });
  }

  Widget getItemWidget(int index) {
    String img = widget.lineList[index].logo;
    String caption = widget.lineList[index].caption;
    String city = widget.lineList[index].startCityName;
    String dis = '';
    if(widget.lineList[index].totalDistance>1000){
      int d = (widget.lineList[index].totalDistance/1000).truncate();
      dis = '往返约${d}km';
    }else{
      dis = '往返约${widget.lineList[index].totalDistance}m';
    }
    String msg =
        "${widget.lineList[index].totalDay}天 $dis ";

    return GestureDetector(
      onTap: () {
        PagePushUtils.push(context,  LineDetailPageScreen(id: widget.lineList[index].id));
      },
      child: Padding(
        padding: EdgeInsets.only(left: 20.px),
        child: ClipRRect(
          borderRadius: BorderRadius.all(Radius.circular(4.px)),
          child: Container(
            width: 320.px,
            padding: EdgeInsets.all(24.px),
            color: MyColors.white,
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Stack(children: [
                  ImageNetworkWidget(
                    img,
                    width: double.infinity,
                    height: 180.px,
                    radius: 8.px,
                  ),

                  Positioned(left: 8.px,bottom: 8.px, child:  Stack(
                    children: [
                      Positioned(top: 0,right: 0,bottom: 0,left: 0, child: ClipRRect(borderRadius: BorderRadius.all(Radius.circular(18.px)), child: Container(color: Colors.black54,),)),
                      Row(children: [
                        SizedBox(width: 8.px,height: 36.px,),
                        BaseImage(image: 'lsgj_icon_address',width: 28.px,height: 28.px,),
                        Text(
                          city,
                          style:
                          TextStyle(fontSize: 22.px, color: MyColors.white),
                        ),
                        SizedBox(width: 12.px,),
                      ],),
                    ],
                  ))

                ],),

                SizedBox(
                  height: 12.px,
                ),
                Text(
                  caption,
                  style:
                      TextStyle(fontSize: 28.px, color: MyColors.color333333),
                  maxLines: 2,
                  overflow: TextOverflow.ellipsis,
                ),
                const Expanded(child: SizedBox()),
                Text(
                  msg,
                  style:
                      TextStyle(fontSize: 24.px, color: MyColors.color999999),
                ),
              ],
            ),
          ),
        ),
      ),
    );
  }
}
